Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Removing createReactClass usage in 3 files. #1893

Merged
merged 27 commits into from
Nov 27, 2024

Conversation

catandthemachines
Copy link
Member

@catandthemachines catandthemachines commented Nov 20, 2024

Summary:

Removing createReactClass usage in the following three files:

  • drag-target.tsx
  • sortable.tsx
  • stateful-editor-page.tsx

Issue: LEMS-365

Test plan:

Run "yarn test" and confirm no errors or regressions are introduced.
Run "yarn start" and look and view if there are any issues with any Perseus components.

@catandthemachines catandthemachines self-assigned this Nov 20, 2024
@khan-actions-bot khan-actions-bot requested a review from a team November 20, 2024 19:40
@khan-actions-bot
Copy link
Contributor

khan-actions-bot commented Nov 20, 2024

Gerald

Required Reviewers
  • @Khan/perseus for changes to .changeset/khaki-keys-approve.md, packages/perseus-editor/src/index.ts, packages/perseus-editor/src/components/drag-target.tsx, packages/perseus-editor/src/components/sortable.tsx

Don't want to be involved in this pull request? Comment #removeme and we won't notify you of further changes.

Copy link
Contributor

github-actions bot commented Nov 20, 2024

Size Change: -586 B (-0.05%)

Total Size: 1.29 MB

Filename Size Change
packages/perseus-editor/dist/es/index.js 697 kB -586 B (-0.08%)
ℹ️ View Unchanged
Filename Size
packages/kas/dist/es/index.js 39 kB
packages/keypad-context/dist/es/index.js 760 B
packages/kmath/dist/es/index.js 4.27 kB
packages/math-input/dist/es/index.js 77.9 kB
packages/math-input/dist/es/strings.js 1.79 kB
packages/perseus-core/dist/es/index.js 1.48 kB
packages/perseus-linter/dist/es/index.js 22.2 kB
packages/perseus/dist/es/index.js 422 kB
packages/perseus/dist/es/strings.js 3.68 kB
packages/pure-markdown/dist/es/index.js 3.66 kB
packages/simple-markdown/dist/es/index.js 12.5 kB

compressed-size-action

Copy link
Collaborator

@jeremywiebe jeremywiebe left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Most of this is great. 🎉

Requesting changes for the comment about default props not being necessary for the SortableItem changes.

packages/perseus-editor/src/components/drag-target.tsx Outdated Show resolved Hide resolved
packages/perseus-editor/src/components/drag-target.tsx Outdated Show resolved Hide resolved
packages/perseus-editor/src/components/sortable.tsx Outdated Show resolved Hide resolved
Comment on lines 51 to 53
getInitialState() {
return {dragHover: false};
},
handleDrop: function (e) {
}
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

When initial state doesn't depend on anything, I typically avoid the function getInitialState() and just define state like this:

    state: State = {dragHover: false};

packages/perseus-editor/src/components/drag-target.tsx Outdated Show resolved Hide resolved
packages/perseus-editor/src/components/sortable.tsx Outdated Show resolved Hide resolved
packages/perseus-editor/src/components/sortable.tsx Outdated Show resolved Hide resolved
packages/perseus-editor/src/stateful-editor-page.tsx Outdated Show resolved Hide resolved
Copy link
Contributor

github-actions bot commented Nov 25, 2024

npm Snapshot: Published

Good news!! We've packaged up the latest commit from this PR (9db2826) and published it to npm. You
can install it using the tag PR1893.

Example:

yarn add @khanacademy/perseus@PR1893

If you are working in Khan Academy's webapp, you can run:

./dev/tools/bump_perseus_version.sh -t PR1893

Copy link
Member

@benchristel benchristel left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for doing this upgrade! I left a few questions and suggestions inline. In particular, I'd like to confirm that it's safe to use this.props.components instead of this.state.components in sortable.tsx before this lands.

packages/perseus-editor/src/components/sortable.tsx Outdated Show resolved Hide resolved
packages/perseus-editor/src/components/sortable.tsx Outdated Show resolved Hide resolved
packages/perseus-editor/src/components/sortable.tsx Outdated Show resolved Hide resolved
packages/perseus-editor/src/components/sortable.tsx Outdated Show resolved Hide resolved
packages/perseus-editor/src/components/sortable.tsx Outdated Show resolved Hide resolved
Copy link
Member

@benchristel benchristel left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM!

Comment on lines +23 to +27
* TODO(LEMS-2667): 11/26/24, at the time of writing this comment
* it has been identified that this file has been broken long before
* the refactoring of createReactClass. Future implementation need
* to determine how to fix this functionality or deprecate it.
* *
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice, thanks for leaving this comment here.

Comment on lines 179 to 181
constructor(props) {
super(props);
}
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

When you are just calling super(props); in a constructor, you can elide it.

Suggested change
constructor(props) {
super(props);
}

Copy link
Collaborator

@jeremywiebe jeremywiebe left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is looking great. I'd recommend resolving the two comments about default vs. named exports, but otherwise you're good to go! Thanks for all the cleanup here Cat!

packages/perseus-editor/src/components/drag-target.tsx Outdated Show resolved Hide resolved
packages/perseus-editor/src/components/sortable.tsx Outdated Show resolved Hide resolved
@catandthemachines catandthemachines merged commit 3d777d1 into main Nov 27, 2024
9 checks passed
@catandthemachines catandthemachines deleted the catjohnson/remove-createreactclass branch November 27, 2024 23:21
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants